import { Table, Button, Space } from 'antd';

// 定义虚拟数据
const usersData = [
  {
    user_id: 1,
    // 修改为中文用户名
    username: '管理员',
    password: 'encrypted_password_1',
    // 修改为中文真实姓名
    real_name: '管理用户',
    contact_number: '1234567890',
    email: 'admin@example.com',
    user_role: 'admin'
  },
  {
    user_id: 2,
    username: '员工一',
    password: 'encrypted_password_2',
    real_name: '员工一号',
    contact_number: '0987654321',
    email: 'employee1@example.com',
    user_role: 'employee'
  },
  {
    user_id: 3,
    username: '供应商一',
    password: 'encrypted_password_3',
    real_name: '供应商一号',
    contact_number: '5555555555',
    email: 'supplier1@example.com',
    user_role: 'supplier'
  },
  {
    user_id: 4,
    username: '客户一',
    password: 'encrypted_password_4',
    real_name: '客户一号',
    contact_number: '6666666666',
    email: 'customer1@example.com',
    user_role: 'customer'
  }
];

export default function UserList() {
  const columns = [
    {
      title: '用户 ID',
      dataIndex: 'user_id',
      key: 'user_id'
    },
    {
      title: '用户名',
      dataIndex: 'username',
      key: 'username'
    },
    {
      title: '真实姓名',
      dataIndex: 'real_name',
      key: 'real_name'
    },
    {
      title: '联系方式',
      dataIndex: 'contact_number',
      key: 'contact_number'
    },
    {
      title: '邮箱',
      dataIndex: 'email',
      key: 'email'
    },
    {
      title: '用户角色',
      dataIndex: 'user_role',
      key: 'user_role'
    },
    {
      title: '操作',
      key: 'action',
      render: (_, record) => (
        <Space>
          <Button type="link">编辑</Button>
          <Button type="link" danger>删除</Button>
        </Space>
      )
    }
  ];

  return (
    <div style={{ padding: 24 }}>
      <Button type="primary" style={{ marginBottom: 16 }}>新建用户</Button>
      <Table columns={columns} dataSource={usersData} rowKey="user_id"  size="small"/>
    </div>
  );
}